<!-- 语音播报 -->
<template>
	<view>
		<view style="height: 40rpx;width: 750rpx;background-color: #fff;"></view>
		<!-- 顶部 -->
		<view class="top">
			<view class="back" @click="$win.back()">
				<view>
					<image src="/static/iconfont/arrow-left-bold.png" mode="aspectFill"></image>
				</view>
				<text>{{topTitle}}</text>
			</view>
		</view>
		<view class="body">
			<view class="son" v-for="k in 6">
				<view class="box">
					<image src="" mode="" style="background-color: skyblue;"></image>
					<!-- <audio src=""></audio> -->
					<!-- 用uni.createInnerAudioContext()控制播放 -->
				</view>
				<text>倒车入库</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				topTitle:'',
				lists2: [{
					pic: '',
					text: '',
					audioSrc: '',
				}],
				lists3: [],
			}
		},
		methods: {

		},
		onLoad(option) {
			this.topTitle=option.title+'语音报播'
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f2f3f5;
	}

	.top {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 750rpx;
		height: 88rpx;
		background: #ffffff;

		.back {
			display: flex;
			flex-direction: row;
			align-items: center;

			view {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 88rpx;
				height: 88rpx;

				image {
					width: 20rpx;
					height: 34rpx;
				}
			}

			text {
				height: 34rpx;
				line-height: 34rpx;
				font-size: 34rpx;
				font-family: Source Han Sans CN, Source Han Sans CN-Regular;
				font-weight: 400;
				text-align: left;
				color: #333333;
			}
		}
	}

	.body {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 750rpx;
		padding: 6rpx 0;

		.son {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			background-color: #fff;
			width: 248rpx;
			height: 248rpx;
			margin-bottom: 6rpx;

			.box {
				position: relative;
				width: 120rpx;
				height: 120rpx;

				image {
					position: absolute;
					top: 0;
					left: 0;
					width: 120rpx;
					height: 120rpx;
					z-index: 2;
				}

				// audio{
				// 	position: absolute;
				// 	top: 0;
				// 	left: 0;
				// 	width: 120rpx;
				// 	height: 120rpx;
				// }
			}

			text {
				margin-top: 20rpx;
				font-size: 28rpx;
				font-family: Source Han Sans CN, Source Han Sans CN-Regular;
				font-weight: 400;
				text-align: center;
				color: #333333;
			}
		}
	}
</style>
